<!DOCTYPE html>
<html lang="en">
<head>
    #include("../include/header.html")
</head>
<body>

<div class="container">
    #include("../include/menu.html")

    <div class="row" style="margin-bottom: 10px">

        <div class="col-sm-12">
            <!-- 标准的按钮 -->
            <button type="button" class="btn btn-primary" onclick="uploadCreateSql()">上传建表SQL</button>
        </div>

        <div class="col-sm-12">
            <table class="table table-bordered table-hover table-condensed">
                <thead>
                <tr>
                    <th>表名</th>
                    <th>实体名</th>
                    <th>包路径</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>
                        <div class="input-group">
                            <input type="text" class="form-control" placeholder="demo_table" name="tableName">
                        </div>
                    </td>
                    <td>
                        <div class="input-group">
                            <input type="text" class="form-control" placeholder="demoEntity" name="entityName">
                        </div>
                    </td>
                    <td>
                        <div class="input-group">
                            <input type="text" class="form-control" placeholder="io.gite.xjt2016.modules"
                                   name="basePackage">
                        </div>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>

        <div class="col-sm-12">
            <div>
                <button type="button" class="btn btn-danger" onclick="destroyTable()">清空表信息</button>
                <button type="button" class="btn btn-primary" onclick="addColumn()">新增表字段</button>
                <button type="button" class="btn btn-default" onclick="genCode()">生成代码</button>
            </div>
            <table id="columnTable" class="table table-bordered table-hover table-condensed">

            </table>
        </div>
    </div>

</div>

#include("../include/footer.html")

<script>
    var columnTable;
    var jdbcTypes = JSON.parse('${json(jdbcTypes)}');
    var javaTypes = JSON.parse('${json(javaTypes)}');

    $(function () {
        var columns = [];
        columnTable = $('#columnTable');

        columnTable.bootstrapTable({
            columns: [
                {
                    field: 'javaFieldName', title: '字段名',
                    editable: {
                        type: 'text',
                        title: '字段名',
                        mode: "inline",
                        showbuttons: false,
                        validate: function (v) {
                            if (!v) return '字段名不能为空';
                        }
                    }
                },

                {
                    field: 'colType', title: '数据库字段类型', editable: {
                        type: 'select',
                        title: '数据库字段类型',
                        mode: "inline",
                        showbuttons: false,
                        source: jdbcTypes
                    }
                },
                {
                    field: 'javaFieldType', title: 'Java数据类型', editable: {
                        type: 'select',
                        title: 'Java数据类型',
                        mode: "inline",
                        showbuttons: false,
                        source: javaTypes
                    }
                },
                // {
                //     field: 'length', title: '长度', editable: {
                //         type: 'text',
                //         title: '长度',
                //         mode: "inline",
                //         showbuttons: false,
                //     }
                // },
                // {
                //     field: 'javaType', title: 'java数据类型', editable: {
                //         type: 'select',
                //         title: '数据类型',
                //         mode: "inline",
                //         showbuttons: false,
                //         source: {}
                //     }
                // },
                {
                    field: 'defaultValue', title: '默认值',
                    formatter: function (value, row, index) {
                        if (value === undefined || value === null) {
                            return '';
                        }
                        return value;
                    },
                    editable: {
                        type: 'text',
                        mode: "inline",
                        title: '默认值',
                        showbuttons: false,
                    }
                },
                {
                    field: 'nullable', title: '是否为空',
                    formatter: function (value, row, index) {
                        console.log(value);
                        if (value === null || value === undefined) {
                            return 'true';
                        }
                        return '' + value + '';
                    },
                    editable: {
                        type: 'select',
                        title: '是否必须',
                        mode: "inline",
                        showbuttons: false,
                        source: [{value: true, text: "为空"}, {value: false, text: "不为空"}]
                    },
                },
                {
                    field: 'colComment', title: '描述',
                    formatter: function (value, row, index) {
                        if (value === undefined || value == null) {
                            return '';
                        }
                        return value;
                    },
                    editable: {
                        type: 'text',
                        mode: "inline",
                        title: '描述',
                        showbuttons: false,
                    }
                },
                {
                    field: 'operator', title: '操作',
                    formatter: 'operateFormatter'
                },

            ],
            data: columns,
        });
    });

    function destroyTable() {
        columnTable.bootstrapTable('load', []);

    }


    // 模拟表单提交同步方式下载文件
    // 能够弹出保存文件对话框
    function downloadFileByForm() {
        console.log("ajaxDownloadSynchronized");
        var url = pathPrefix + "/gen";
        var fileName = "testAjaxDownload.txt";
        var form = $("<form></form>").attr("action", url).attr("method", "post");
        form.append($("<input></input>")
            .attr("type", "hidden")
            .attr("name", "fileName")
            .attr("value", fileName));
        form.appendTo('body').submit().remove();
    }

    function genCode() {
        var columns = columnTable.bootstrapTable('getData');
        // layer.alert(JSON.stringify(data));
        var entityName = $('input[name=entityName]').val();
        var basePackage = $('input[name=basePackage]').val();

        var data = {"columns": columns, "entityName": entityName, "basePackage": basePackage}

        layer.prompt({
            formType: 2,
            maxlength: 1000,
            title: '生成Java代码',
            value: JSON.stringify(data)
        }, function (val, index) {
            var url = pathPrefix + "/gen";//请求的url
            var form = $('<form method="POST" action="' + url + '"></from>');

            var _input = $('<input/>', {type: "hidden", name: "info"});
            _input.val(JSON.stringify(data));
            form.append(_input);

            $('body').append(form);
            form.submit();
            form.remove();
            layer.close(index);
        });
    }

    function addColumn() {
        var row = {
            name: 'new_column',
            type: 'varchar',
            length: 16,
            javaType: 'String'
        }
        columnTable.bootstrapTable('append', row)
    }

    function uploadCreateSql() {
        layer.prompt({
            formType: 2,
            maxlength: 300,
            title: '上传建表SQL',
            value: 'CREATE TABLE `function1` (`id` INT UNSIGNED NOT NULL AUTO_INCREMENT,`project_id` INT NOT NULL,`name` VARCHAR (64) NOT NULL DEFAULT \'\',`description` VARCHAR (256) DEFAULT NULL,PRIMARY KEY (`id`)) ENGINE=INNODB AUTO_INCREMENT=7 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci'
        }, function (val, index) {
            $.ajax({
                type: 'POST',
                url: pathPrefix + "/uploadCreateSql",
                data: {sql: val},
                dataType: 'json',
                success: function (result) {
                    layer.close(index);
                    if (result) {
                        console.log(result);
                        if (result.result && result.result === 100) {
                            toastr.success('建表语句上传成功');

                            var tableName = result.data.tableName;
                            $('input[name=tableName]').val(tableName);

                            var entityName = result.data.entityName;
                            $('input[name=entityName]').val(entityName);

                            var basePackage = result.data.basePackage;
                            $('input[name=basePackage]').val(basePackage);


                            var columns = result.data.columns;
                            columnTable.bootstrapTable('load', columns);
                        } else {
                            toastr.error('建表语句上传失败：' + result.message);
                        }
                    } else {
                        toastr.error('建表语句上传失败：');
                    }
                },
            });
        });
    }

    // 格式化按钮
    function operateFormatter(value, row, index) {
        var arr = [];

        var delUrl = pathPrefix + '/delete?id=' + row.id;
        // var del = '<a href="#"  class="btn btn-danger btn-xs"><i class="fa fa-trash"></i> 删除</a> \n';
        var del = '<a href="' + delUrl + '" onclick="return confirmx(\'确定删除吗？\', this.href)" class="btn btn-danger btn-xs"><i class="fa fa-trash"></i> 删除</a> \n';

        arr.push(del);
        return arr.join('');
    }


</script>
</body>
</html>